@import "zdzreset";
@import "public";

.header {
    width: 100%;
    background-color: #f7f7f7;
    display: flex;
    span {
        font-size: r(35px);
        display: inline-block;
        flex-grow: 0.5;
        text-align: right;
        i {
            font-size: r(37px);
            line-height: r(88px);
        }
    }
    .contant{
        flex-grow: 9;
        text-align: center;
        transform:translateX(r(-30px));
        span {
            line-height: r(88px);
        }
    }
}


.money{
    width: 100%;
    background-color: #ffffff;
    display: flex;
    height: r(95px);
    line-height: r(95px);
    span{
        display: block;
        font-size: r(24px);
        color: #666;
        border-bottom: 1px solid #e1e2e4;
    }
    .text{
        margin-left: r(20px);
        flex-grow: 9;
    }
    .num{
        flex-grow: 1;
        text-align: center;
        font-size: r(35px);
    }
}

.contant{
    .message{
        width: 100%;
        background-color: #fff;
        padding-top: r(30px);
        font-size: r(24px);
        height: r(460px);
        ul{
            li{
                display: flex;
                padding-left: r(20px);
                span{
                    display: block;
                    font-size: r(24px);
                }
            }
            .type{
                span:first-of-type{
                    flex-grow: 8;
                }
                span:last-of-type{
                    flex: 1.7;
                    text-align: center;
                }
            }
            .time{
                span:first-of-type{
                    flex-grow: 8;
                }
                span:last-of-type{
                    flex: 9.5;
                    text-align: center;
                }
            }
            .waternum{
                span:first-of-type{
                    flex-grow: 8;
                }
                span:last-of-type{
                    flex: 11;
                    text-align: center;
                }
            }
            .num{
                span:first-of-type{
                    flex-grow: 8;
                }
                span:last-of-type{
                    flex: 20;
                    text-align: center;
                }
            }
            .cus{
                span:first-of-type{
                    flex-grow: 8;
                }
                span:last-of-type{
                    flex: 2;
                    text-align: center;
                }
            }
            .pay{
                span:first-of-type{
                    flex-grow: 8;
                }
                span:last-of-type{
                    flex: 3;
                    text-align: center;
                }
            }
            .own{
                span:first-of-type{
                    flex-grow: 8;
                }
                span:last-of-type{
                    flex: 2.3;
                    text-align: center;
                }
            }
        }
    }
}
.footer{
    width: 100%;
    padding-top: r(35px);
    padding-bottom: r(35px);
    .contant{
        height: 100%;
        p{
            font-size: r(20px);
            color: #999;
            margin-left: r(27px);
        }
        p:last-of-type{
            color: #153fc6;
        }
    }
}

.test{
    display: none;
}

.explain{
    width: 100%;
    background-color: #ffffff;
    .contant{
        padding-left: r(27px);
        padding-top: r(40px);
        p:first-of-type{
            font-size: r(30px);
            color: #333;
            margin-bottom: r(50px);
        }
        p:last-of-type{
            font-size: r(24px);
            color: #666666;
            margin-bottom: r(52px);
        }
        span{
            display: block;
            width: r(580px);
            text-align: justify;
            line-height: r(35px);
            padding-left: r(3px);
            font-size: r(24px);
            color: #666;
        }
        span:first-of-type{
            margin-bottom: r(54px);
        }
        span:last-of-type{
            padding-bottom: r(53px);
        }
    }
}
